<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:p="http://primefaces.org/ui"
	xmlns:f="http://java.sun.com/jsf/core">

<h:head>
	<f:loadBundle basename="com.davivienda.oneclick.bundle.messages"
		var="msg" />
<style type="text/css">
/* tamaño de fuente base */
.ui-widget .ui-widget {
    font-size: 11px;
}
/*tamaño de la pantalla*/
.panel
{
	border:none !important;
	width:1024px !important;
}
/*color de letra datatables*/
.ui-resizable-column {
	color: #000000 !important;
}
/*bordes de los botones*/
.ui-corner-all {
	border-radius: 0px;
}

/*estilo botones*/
.ui-button-text-only {
	border: 1px solid #7f1613 !important;
	background: #b20000 !important;
	color: #ffffff !important;
	padding: 0px;
	margin: 0px;
	border-spacing: 0px;
}
/*colores barra del paginador*/
.ui-paginator-bottom {
	border: none !important;
	color: black !important;
	background: white !important;
}
/*titulo de panel*/
.ui-panel .ui-panel-titlebar {
	border: none !important;
	color: #A81918 !important;
	font-size: 1.125em !important;
	background: white !important;
}
/*tamaño fuente datatable*/
.ui-datatable table {
	font-size: 11px !important;
}
/*botones negros*/
.boton_negro {
	background: #282828 !important;
	border: 1px solid #282828 !important;
}
/* espaciado en encabezado de datatable*/
.ui-datatable th {
white-space: normal !important;
}
/*ubicacion de icono de sort en las datatable*/
.ui-datatable .ui-sortable-column-icon { 
position: static !important; 
} 
/*ubicacion de icono de sort en las datatable*/
td.sort 
{ 
	font-weight:bold !important;
	text-align:center !important;
}
	/*estilos para paginador de pymes*/
	.ui-paginator-first
	{
		border:none !important;
		background:white !important;
		color:  #0000FF !important;
		text-decoration:underline !important;
	}
	.ui-paginator-next
	{
		border:none !important;
		background:white !important;
		color:  #0000FF !important;
		text-decoration:underline !important;
	}
	.ui-paginator-prev
	{
		border:none !important;
		background:white !important;
		color:  #0000FF !important;
		text-decoration:underline !important;
	}
	.ui-paginator-last
	{
		border:none !important;
		background:white !important;
		color:  #0000FF !important;
		text-decoration:underline !important;
	}
	.ui-paginator-page
	{
		border:none !important;
		background:white !important;
		color:  #0000FF !important;
		text-decoration:underline !important;
	}
	.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active 
	{
		color:  black !important;
		
	}
	/**********************************/
</style>
</h:head>

<h:body style="font-size:10px;">

	<h:body style="font-size:10px;">

		<h:form id="form">

			<p:panel styleClass="panel" id="panel"
				header="#{msg.adminsitracionServicios}"
				style="margin-bottom:10px; font-size: 15px;">
				<p:messages id="messages" />


				<h:panelGrid columns="2" style="font-size: 11px;">
					<h:outputText value="#{msg.datosEmpresa}"
						style="color: #b20000; font-weight:bold; font-size: 13px;" />
					<h:outputText value="" />
					<h:outputText value="#{msg.tipoIdentificacionEmpresa}: " />
					<h:outputText value="NIT" />
					<h:outputText value="#{msg.numeroIdentificacion}: " />
					<h:outputText value="8007327326" />
					<h:outputText value="#{msg.nombreEmpresa}: " />
					<h:outputText value="HANNA MONTANA Y CIA" />
					<h:outputText value="#{msg.noCliente}: " />
					<h:outputText value="805" />
					<h:outputText value="#{msg.seguimiento}: " />
					<h:outputText value="PYMES" />
				</h:panelGrid>
				<br />

				<h:panelGrid columns="2" style="font-size: 11px;">
					<h:outputText value="#{msg.datosServicios}"
						style="color: #b20000; font-weight:bold; font-size:13px;" />
					<h:outputText value="" />
					<h:outputText value="#{msg.nombreServicio}: " />
					<h:outputText value="Multiabonos" />
					<h:outputText value="#{msg.codigoServicio}: " />
					<h:outputText value="MULT" />
					<h:outputText value="#{msg.estadoServicio}: " />
					<h:selectOneMenu id="codigot" value="#{pprBean.firstname}">
						<f:selectItem itemLabel="Vigente" itemValue="" />
						<f:selectItems value="#{pprBean.cities}" />
					</h:selectOneMenu>
				</h:panelGrid>
				<br />


				<h:panelGrid columns="2" style="font-size: 11px;">
					<h:outputText value="#{msg.incluirParametrosDispersion}"
						style="color: #b20000; font-weight:bold; font-size:13px" />
					<h:outputText value="" />
					<h:outputLabel for="codigo" value="#{msg.codigoUnico}:" />
					<h:selectOneMenu id="codigo" value="#{pprBean.firstname}">
						<f:selectItem itemLabel="Select One" itemValue="" />
						<f:selectItems value="#{pprBean.cities}" />
					</h:selectOneMenu>
					<h:outputLabel for="franquicia" value="#{msg.franquicia}:" />
					<h:selectOneMenu id="franquicia" value="#{pprBean.firstname}">
						<f:selectItem itemLabel="Select One" itemValue="" />
						<f:selectItems value="#{pprBean.cities}" />
					</h:selectOneMenu>
					<h:outputLabel for="tipoCuenta" value="#{msg.tipoCuenta}:" />
					<h:selectOneMenu id="tipoCuenta" value="#{pprBean.firstname}">
						<f:selectItem itemLabel="Select One" itemValue="" />
						<f:selectItems value="#{pprBean.cities}" />
					</h:selectOneMenu>
					<h:outputLabel for="cuentaComercio" value="#{msg.cuentaComercio}:" />
					<p:autoComplete id="cuentaComercio" dropdown="true"
						value="#{autoCompleteBean.selectedPlayer2}"
						completeMethod="#{autoCompleteBean.completePlayer}" />
					<h:outputLabel for="tipoDispersion" value="#{msg.tipoDispersion}:" />
					<h:selectOneMenu id="tipoDispersion" value="#{pprBean.firstname}">
						<f:selectItem itemLabel="Select One" itemValue="" />
						<f:selectItems value="#{pprBean.cities}" />
					</h:selectOneMenu>
					<h:outputLabel for="dispersionDavivienda"
						value="#{msg.dispersionDavivienda}:" />
					<p:inputText id="dispersionDavivienda" value="#{pprBean.firstname}" />
					<h:outputLabel for="dispersionCliente"
						value="#{msg.dispersionCliente}:" />
					<p:inputText id="dispersionCliente" value="#{pprBean.firstname}" />
					<h:outputLabel for="empresaDestino" value="#{msg.empresaDestino}:" />
					<h:selectOneMenu id="empresaDestino" value="#{pprBean.firstname}">
						<f:selectItem itemLabel="Select One" itemValue="" />
						<f:selectItems value="#{pprBean.cities}" />
					</h:selectOneMenu>
					<h:outputLabel for="productoDestino" value="#{msg.tipoProductoDestino}:" />
					<h:selectOneMenu id="productoDestino" value="#{pprBean.firstname}">
						<f:selectItem itemLabel="Select One" itemValue="" />
						<f:selectItems value="#{pprBean.cities}" />
					</h:selectOneMenu>
					<h:outputLabel for="nProductoDestino"
						value="#{msg.numeroProductoDestino}:" />
					<h:selectOneMenu id="nProductoDestino" value="#{pprBean.firstname}">
						<f:selectItem itemLabel="Select One" itemValue="" />
						<f:selectItems value="#{pprBean.cities}" />
					</h:selectOneMenu>

				</h:panelGrid>
				<br />
				<h:panelGrid columns="2" styleClass="centrar">
					<p:button value="#{msg.adicionar}" style="font-size: 11px;"></p:button>
					<p:button value="#{msg.consultar}" style="font-size: 11px;"></p:button>
				</h:panelGrid>
				<br />
				<p:panel style="border:none !important;">
					<p:dataTable id="cars" var="car" resizableColumns="true"
						value="#{tableBean.datamodel}" paginator="true"
						paginatorPosition="bottom" rows="10"
						currentPageReportTemplate="#{msg.numeroRegistros} {startRecord} #{msg.a} {endRecord} #{msg.de} {totalRecords}"
						paginatorTemplate="{CurrentPageReport} {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink}
{LastPageLink}"
						selection="#{tableBean.selectedCar}">

						<p:column selectionMode="single" style="width:4% !important" />
						<p:column headerText="#{msg.codigoUnico}" sortBy="#{car.year}"></p:column>
						<p:column headerText="#{msg.franquicia}" sortBy="#{car.manufacturer}"></p:column>
						<p:column headerText="#{msg.tipoCuenta}" sortBy="#{car.manufacturer}"></p:column>
						<p:column headerText="#{msg.tipoDispersion}" sortBy="#{car.year}"></p:column>
						<p:column headerText="#{msg.valorDispersionDavivienda}"
							sortBy="#{car.manufacturer}"></p:column>
						<p:column headerText="#{msg.valorDispersionCliente}"
							sortBy="#{car.manufacturer}"></p:column>
						<p:column headerText="#{msg.tipoProductoDestino}" sortBy="#{car.year}"></p:column>
						<p:column headerText="#{msg.numeroProductoDestino}"
							sortBy="#{car.manufacturer}"></p:column>
						<p:column headerText="#{msg.estado}"></p:column>
					</p:dataTable>
				</p:panel>
			<h:panelGrid columns="2">
				<p:button styleClass="boton_negro" value="#{msg.modificar}"
					style="font-size: 11px;"></p:button>
				<p:button styleClass="boton_negro" value="#{msg.eliminar}"
					style="font-size: 11px;"></p:button>
			</h:panelGrid>

				<div class="ui-messages-info ui-corner-all"
					style="background-color: #EEEAE9 !important; color: #A81918 !important; font-size: 13px;">
					<span class="ui-messages-info-icon"></span> <span
						class="ui-messages-info-summary"><h:outputText
							value="#{msg.msgActivarOrdenes}" /></span> <span
						class="ui-messages-info-detail"><h:outputText
							value="#{msg.msgRecuerdePresionarActivar}" /></span>

				</div>
				<h:panelGrid columns="1" styleClass="centrar">
					<p:button value="#{msg.activar}" style="font-size: 11px;"></p:button>
				</h:panelGrid>
			</p:panel>
		</h:form>

	</h:body>

</h:body>

</html>